<script setup>
    import formItem from '@/components/formItem.vue'
    const {category,info,brandList} = defineProps({
        category: Object,
        detail: {
            name: String
        },
        brandList: Array
    })

    const emit = defineEmits('weightChanges')
    const weightChange = (e) => {
        if(!isNaN(Number(e))){
            emit('weightChanges',Number(e))
        }
    }
</script>

<template>
   <div class="productDetail">
        <el-form>
            <el-form-item label="商品分类：">
                <el-cascader
                    v-model="detail.productCategoryId"
                    placeholder="请选择"
                    :options="category" :props="{
                        value: 'id',
                        label: 'name'
                    }" />
            </el-form-item>
            <el-form-item label="商品名称：">
                <el-input type="text" v-model="detail.name" />
            </el-form-item>
            <el-form-item label="&emsp;副标题：" >
                <el-input type="text" v-model="detail.subTitle" />
            </el-form-item>
            <el-form-item label="商品品牌：" >
                <el-select
                    v-model="detail.brandId"
                    placeholder="请选择">
                    <el-option v-for="item in brandList" :key="item.id" :label="item.name"
                        :value="item.id" />
                </el-select>
            </el-form-item>
            <el-form-item label="商品介绍：" >
                <el-input v-model="detail.description" type="textarea" />
            </el-form-item>
            <el-form-item label="商品货号：" >
                <el-input type="text" v-model="detail.productSn" />
            </el-form-item>
            <el-form-item label="商品售价：" >
                <el-input type="text" v-model="detail.price" />
            </el-form-item>
            <el-form-item label="&emsp;市场价：" >
                <el-input type="text" v-model="detail.originalPrice" />
            </el-form-item>
            <el-form-item label="商品库存：" >
                <el-input type="text" v-model="detail.stock" />
            </el-form-item>
            <el-form-item label="计量单位：" >
                <el-input type="text" v-model="detail.unit" />
            </el-form-item>
            <el-form-item >
                <form-item 
                    :title="'商品重量'"
                    :value="detail.weight"
                    :txtShow="true"
                    :txt="'克'"
                    @change="weightChange"
                />
            </el-form-item>
            <el-form-item label="&emsp;&emsp;排序：" >
                <el-input type="text" v-model="detail.sort" />
            </el-form-item>
        </el-form>
   </div> 
</template>